<template>
  <div class="BaseSearchBar">
    <el-card body-style="padding:0px">
      <el-row
        type="flex"
        justify="flex-start"
      >
        <!-- 标题 -->
        <el-col
          :span="2"
          style="font-size:12px"
          type="flex1"
        >
          <div class="search-title">条件搜索栏</div>
        </el-col>
        <!-- 搜索关键字 -->
        <el-col :span="4">
          <BaseSearchBarItem>
            <div
              slot="lable"
              class="key"
            >搜索关键字:</div>
            <div slot="input">
              <el-input
                v-model="queryInfoChild.srm"
                placeholder="请输入关键字"
              />
            </div>
          </BaseSearchBarItem>
        </el-col>

        <!-- 药品分类 -->
        <el-col :span="4">
          <BaseSearchBarItem>
            <div slot="lable">药品分类:</div>
            <div slot="input">
              <el-select
                v-model="queryInfoChild.drugNameType"
                placeholder="全部"
              >
                <el-option
                  v-for="item in DrugClass"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </div>
          </BaseSearchBarItem>
        </el-col>

        <!-- 重点提示 -->
        <el-col :span="4">
          <BaseSearchBarItem>
            <div slot="lable">重点提示:</div>
            <div slot="input">
              <el-select
                v-model="queryInfoChild.highRisk"
                placeholder="全部"
              >
                <el-option
                  v-for="item in KeyPoints"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </div>
          </BaseSearchBarItem>
        </el-col>

        <!-- 按钮 -->
        <el-col
          :span="2"
          style="margin-left: 12px;display: flex;
        align-items: center;"
        >
          <el-button
            type="primary"
            size="medium"
            v-on:click="SearchEvent"
          >搜索</el-button>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>
<script>
// import BaseSearchBarItem from "./BaseSearchBarItem";
import BaseSearchBarItem from "../../../components/BaseSearchBarItem";
export default {
  name: "BaseSearchBar",
  components: {
    BaseSearchBarItem
  },
  props: {
    isShow: {
      input: null,
      key: null
    }
  },
  data() {
    return {
      queryInfoChild: {
        // 搜索关键字
        srm: "",
        // 配对标记 -1表示无法配对 0 表示未配对 1已配对；
        match_state: "",
        // 	药品名称分类 0 不确定 1 西药 2 中药
        drugNameType: "",
        highRisk: ""
      },
      SearchPoints: "",
      DrugClass: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "不确定"
        },
        {
          value: 1,
          label: "西药"
        },
        {
          value: 2,
          label: "中药"
        }
      ],
      KeyPoints: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 1,
          label: "是"
        },
        {
          value: 0,
          label: "否"
        }
      ]
    };
  },
  methods: {
    SearchEvent: function() {
      this.$emit("ChildSearchEvent", this.queryInfoChild);
    }
  }
};
</script>
<style>
.search-title {
  color: #696969;
  border-right: 1px solid #c2c2c2;
  height: 50px;
  text-align: center;
  line-height: 50px;
}
</style>
